<!DOCTYPE html>
<html>
<meta charset ="utf-8">
<head>
	<title>慕课网-国内最大的IT技能学习平台</title>
<style type="text/css">
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;}
body{background:#fff;color:#333;font: 14px/1.5 "Microsoft Yahei", "Hiragino Sans GB", Helvetica, "Helvetica Neue", "微软雅黑", Tahoma, Arial, sans-serif; margin-top:0px;}
h1,h2,h3,h4,h5,h6{
  font-weight: normal;
  font-family: "Microsoft YaHei";
  }
a{text-decoration: none;}
ul,ol{list-style-type:none;}
select,input,img,select{vertical-align:middle;}
	.header{
		height: 60px;
		width: 100%;
		background-color: black;
	}
	.logo{
		width: 140px;
		height: 60px;
		background: url(0.png) no-repeat center center;
		float: left;
		margin:0 20px;
	}
	.header-list{	
		height: 60px;
		width: 320px;
		float: left;
	}
	.header-list ul{
		height: 60px;
		float: left;
	}
	.header-list ul li {
		float: left;
		height: 60px;
		width: 80px;
		line-height: 60px;
	}
	.header-list ul li a{
		text-decoration: none;
    	color: #787d82;
   	 	text-align: center;
    	font-size: 14px;
    	height: 60px;
    	line-height: 60px;
    	display: block;
	}
	.header-list ul li a:hover{
		background-color:rgb(54,60,65); 
		color:white;
	}
	.header-enter,.headerapp,.header-search{
		float: right;
	}
	.header-search{
		width: 240px;
		padding: 15px 0;
    	margin-right: 20px;
	}
	.search{
        background-image: url(http://static.mukewang.com/static/img/gsearch-sprite.png);
        background-repeat: no-repeat;
        background-position: 210px 0;
		padding: 5px 10px;
    	width: 220px;
    	height: 20px;
    	line-height: 20px;
    	font-size: 12px;
    	float: left;
   	 	border: 0;
    	background-color: #363c41;
    	color: #14191e;
        transition:background-color 0.3s;
	}
    .search:focus{
        border:0;
        background-color: white;
        outline:none;
        background-position: 210px -40px;
    }
 /*   .header-search .search:-moz-placeholder {
  color: #787d82;
}
.header-search .search::-moz-placeholder {
  color: #787d82;
  opacity: 1;
}
.header-search .search:-ms-input-placeholder {
  color: #787d82;
}
.header-search .search::-webkit-input-placeholder {
  color: #787d82;
}
.header-search .search.placeholder {
  color: #787d82;
}
.search-area.suggest-active .search-input {
  color: #363d40;
  background: #fff;
}
.search-area.suggest-active .btn_search {
  background-position: 0 -40px;
  background-color: #fff;
}*/
	.search-img{
		width: 30px;
		height: 30px;
	}
	.search-img:hover{
		cursor: pointer;
	}
	#header .headerapp a{
		display: block;
    	padding: 0 8px;
    	width: 85px;
    	height: 60px;
    	line-height: 60px;
    	color: #656e73;
	}
    .header-app-icon {
  display: inline-block;
  width: 11px;
  height: 16px;
  background: url(http://static.mukewang.com/static/img/head-app-icon.png) no-repeat 0 0;
  vertical-align: -3px;
  margin-right: 5px;
  transition: .3s;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
}
#header .headerapp a:hover {
  color: #fff;
  background-color: #363c41;
}
.headerapp a:hover i {
  background-position: 0 -16px;
}
	.header-enter{
		margin-right: 22px;
	}
	.header-enter ul li{
		float: left;
	}
	.header-enter ul li{
		float: left;
	}
	.header-enter ul li a{
		display: block;
   		width: 60px;
    	font-size: 14px;
    	text-align: center;
    	height: 60px;
    	line-height: 60px;
    	color: #787d82;
    	text-decoration: none;
	}
	.denglu:hover a{
		background-color: red;
		color: white;
	}
	.zhuce:hover a{
		color: white;
		background-color:rgb(54,60,65); 
	}


	.part-a{
        width:100%;
        overflow: hidden;
		position: relative;
    	height: 600px;
	}
    .part-a:hover .bar-prev,.part-a:hover .bar-next{transform:translateX(0);opacity: 1;}
    .content .listimg{
        height: 600px;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background-repeat: no-repeat;
        background-position: center 0;
        display: none;
    }
    .content .listimg.action{
        display: block;
    }
	.content .first{
        background-image: url(http://www.imooc.com/static/img/index/banner2.jpg);
	}
    .content .first .first-1{
        width: 1200px;
        margin: 0 auto;
        position: relative;
    }
	.content .first .first-1 a{
		position: absolute;
    	right: 80px;
    	top: 360px;
    	height: 14px;
    	line-height: 14px;
    	padding-left: 21px;
    	font-weight: bold;
    	color: black;
    	text-decoration: none;
        background: url(http://static.mukewang.com/static/img/index/banner_sprite.png?1) no-repeat -120px 0;
	}
	.content .second{
		background-image:url(http://img.mukewang.com/565e552c00015b3e20000600.jpg);
	}
	.content .third{
		background-image:url(http://img.mukewang.com/565ec95f0001410120000600.jpg);
	}
	.content .fourth{
		background-image:url(http://img.mukewang.com/565bff100001d7cd20000600.jpg);
	}
    .parta-bar{
        position: absolute;
        top: 50%;
        margin-top: -50px;
        width: 80px;
        height: 100px;
        overflow: hidden;
        opacity: 0;
        text-indent: -90em;
        background: url(http://static.mukewang.com/static/img/index/banner_sprite.png?1);
        background-repeat: no-repeat;
        transition: transform .6s, opacity .6s;
    }
    .part-a .bar-prev{
        left: 0;
        transform: translateX(-100%);
        background-position: 0 -41px;
    }
/* .g-banner:hover .prev,
.g-banner:hover .next{
  opacity: .6;
} */
/* .g-banner:hover .prev, */
    .part-a .bar-prev:hover{
        background-position: -81px -41px;
    }
    .part-a .bar-next{
        right: 0;
        transform: translateX(100%);
        background-position: 0 -142px;
    }
/* .g-banner:hover .next, */
    .part-a .bar-next:hover{
        background-position: -81px -142px;
    }
    .samewidth{
        min-width: 1200px;}
    .minwidth{
        width:1200px;
        margin: 0 auto;
    }
    .box1{
        position: relative;
        padding: 50px 120px;
        height: 183px;
    }
    .pic1{
        position: absolute;
        left: 120px;
        top: 50px;
        opacity: 1;
        filter: alpha(opacity=0);
        width: 135px;
        height: 183px;
        background: url(http://static.mukewang.com/static/img/char-icon1.png) no-repeat center center;
        
    }
    .pic2{
        position: absolute;
        top: 50px;
        left: 50%;
        margin-left: -90px;
        opacity: 1;
        filter: alpha(opacity=0);
        width: 180px;
        height: 181px;
        background: url(http://static.mukewang.com/static/img/char-icon2.png) no-repeat center center;
    }
    .pic3{
        position: absolute;
        top: 50px;
        right: 120px;
        opacity: 1;
        filter: alpha(opacity=0);
        width: 166px;
        height: 181px;
        background: url(http://static.mukewang.com/static/img/char-icon3.png) no-repeat center center;
    }
    #part-c,#part-e,#part-g,#part-h{
        background-color: #eef1f2;
    }
    .six{
        position: relative;
        height: 400px;
        z-index: 1;
    }
        .pic4-1{
        position: absolute;
        width: 581px;
        height: 431px;
        top: -20px;
        left: -15px;
    }
    .pic5-1{
        position: absolute;
        right: 105px;
        top: 164px;
        filter: alpha(opacity=0);
        width: 493px;
        height: 70px;
    }
    .pic4{
        position: absolute;
        width: 580px;
        height: 430px;
        top: -30px;
        right: 0;

    }
    .pic5{
        position: absolute;
        top: 165px;
        left: 105px;
        width: 512px;
        height: 70px;
    }
    .videowrap{
        top:-30px;
        background:url(http://static.mukewang.com/static/img/01-video.png)no-repeat 0 0;
    }
    .stars{
        z-index: 1;
        background:url(http://static.mukewang.com/static/img/01-star.png)no-repeat 0 0;
    }
    .part-c .pic5-1{
        background: url(http://static.mukewang.com/static/img/01-text.png)no-repeat 0 0;
    }
    .computer1{
        background: url(http://static.mukewang.com/static/img/02-computer1.png)no-repeat 0 0;
        
    }
    .computer2{
        background: url(http://static.mukewang.com/static/img/02-computer2.png)no-repeat 0 0;
        
    }
    .part-d .pic5{
        background: url(http://static.mukewang.com/static/img/02-text.png)no-repeat 0 0;
    }

    .calander{
        background: url(http://static.mukewang.com/static/img/03-calendar.png)no-repeat 0 0;
        
    }
    .smoke{
        background: url(http://static.mukewang.com/static/img/03-smoke.png)no-repeat 0 0;
        
    }
    .rocket{
        z-index: 1;
        background: url(http://static.mukewang.com/static/img/03-rockets.png)no-repeat 0 0;
        
    }
    .part-e .pic5-1{
        background: url(http://static.mukewang.com/static/img/03-text.png)no-repeat 0 0;
    }
    .hands{
        background: url(http://static.mukewang.com/static/img/04-hand.png)no-repeat 0 0;
        
    }
    .icon{
        background: url(http://static.mukewang.com/static/img/04-icon.png)no-repeat 0 0;
        
    }
    .part-f .pic5{
        background: url(http://static.mukewang.com/static/img/04-text.png)no-repeat 0 0;
    }
    .content-bar{
        position: absolute;
        bottom: 30px;
        left: 0;
        right: 0;
        text-align: center;
    }
    .content-bar span{
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: 0 5px;
  background-color: #e3daef;
  transition: transform .2s;
  cursor: pointer;
    }
    .content-bar span:active{
        background-color: white;
        transform:scale(1.1);
    }


    .part-g{
        position: relative;
    }
    .seven{
        position: relative;
        height: 200px;
        overflow: hidden;
    }
    .part-g-left{
        position: absolute;
        width: 40px;
        height: 200px;
        top: 0;
        left: 0;
        background-position: 0 0;
        display: none;
        cursor: pointer;
        background: url(http://static.mukewang.com/static/img/index-sprite.png) no-repeat;
    }
    .part-g-right{
        position: absolute;
        width: 40px;
        height: 200px;
        top: 0;
        right: 0;
        background-position: right 0;
        display: none;
        cursor: pointer;
        background: url(http://static.mukewang.com/static/img/index-sprite.png) no-repeat;
    }
    .group{
        position: absolute;
        margin: 0 auto;

    }
    .group li{
        float: left;
        width: 400px;
        overflow: hidden;
    }
    .group a{
        display: block;
        border-left: 1px solid #fff;
        opacity: 0.85;
        filter: alpha(opacity=85);
        transition: opacity 0.3s;
    }
    .group a:hover{
  opacity: 1;
  filter:alpha(opacity=100);
}
    .big{
        text-align: center;
        width: 64px;
        height: 31px;
        margin: 0 auto;
        font-size: 32px;
        padding: 40px 0 30px;
        line-height: 1em;
        background: url(http://static.mukewang.com/static/img/course-text.png) no-repeat center center;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
    }
    .part-h ul li{
        position: relative;
        float: left;
        width: 280px;
        margin: 10px;
        height: 240px;
        background: #f7faf9;
        border-radius: 0 0 1px 1px;
        box-shadow: 0 1px 2px #c5c5c5;
        transition: .3s;
        -moz-transition: .3s;
        -webkit-transition: .3s;
        -o-transition: .3s;
    }
    .part-h ul li:hover{

    }
    a:link, a:visited {
        color: #14191e;
}
    .icourse-img{
        position: relative;
        height: 160px;
        overflow: hidden;
    }
    .icourse-img img {
        transition: .3s;
        -moz-transition: .3s;
        -webkit-transition: .3s;
        -o-transition: .3s;
        line-height: 1em;
    }
    .icourse-course li:hover img{
        transform:scale(1.2,1.2);
    }
    .icourse-course li:hover .icourse-part1{
        opacity: 1;
    }
    .icourse-course li:hover .icourse-part2{
        opacity: 0;
    }
    .icourse-part1 {
        opacity: 0;
        z-index: 10;
    }
    .icourse-part1, .icourse-part2{
        position: absolute;
        top: 160px;
        left: 0;
        right: 0;
        padding: 0 14px;
        height: 78px;
        background: #fff;
        font-size: 12px;
        transition: .3s;
        -moz-transition: .3s;
        -webkit-transition: .3s;
        -o-transition: .3s;
        z-index: 9;
    }
    .icourse-part1 p{
        padding-top: 10px;
        height: 40px;
        line-height: 20px;
        overflow: hidden;
}
    .icourse-part1 span,.icourse-part2 span{
        color: #b4bbbf;
}
    .icourse-part2 h2{
        color: #363d40;
        line-height: 50px;
        height: 50px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        text-align: center;
        font-size: 14px;
}
    .l{
        float: left;
    }
    .r{
        float: right;
    }
    .clearfix:after {
        content: '\0020';
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    .icourse-footer{
        padding: 40px 0 60px;
        text-align: center;
    }
    .icourse-footer a {
        display: inline-block;
        width: 118px;
        border-radius: 50px;
        height: 38px;
        line-height: 38px;
        border: 1px solid #d0d6d9;
        font-size: 16px;
        color: #363d40;
        transition: .3s;
        -moz-transition: .3s;
        -webkit-transition: .3s;
        -o-transition: .3s;
}
.icourse-footer a:hover{
  background-color: #d0d6d9;
}
    .family {
  position: relative;
  background: url(http://static.mukewang.com/static/img/family-bg2.png) repeat-x center center;
}
    .family-item {
  position: relative;
  float: left;
  width: 200px;
  height: 200px;
}
.family-avator {
  position: relative;
  display: block;
  line-height: 0;
}
.family-mask {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: 0.6;
  filter: alpha(opacity=60);
  background-color: #a8acaf;
  transition: opacity .15s;
  -moz-transition: opacity .15s;
  -webkit-transition: opacity .15s;
  -o-transition: opacity .15s;
}
.family-info-t {
  width: 300px;
}
.family-info-s {
  width: 200px;
}
.family-info {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  background-color: #be3948;
  left: 100%;
  z-index: 12;
}
.family-teacher-nick {
  color: #fff;
  font-size: 20px;
  padding: 20px 20px 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1em;
}
.family-info-job {
  font-size: 12px;
  color: #ec9ba4;
  height: 28px;
  overflow: hidden;
  padding: 0 20px;
}
.family-info-desc {
  padding: 20px 20px 0;
  line-height: 20px;
  height: 100px;
  color: #f2bcc2;
  font-size: 12px;
  overflow: hidden;
}
.family-sub-item {
  position: relative;
  float: left;
  width: 100px;
  height: 100px;
}
.family-student-nick {
  color: #fff;
  font-size: 16px;
  padding: 10px 20px 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1em;
}
.family-info-foot {
  padding: 7px 20px 0;
  font-size: 12px;
  color: #ec9ba4;
  line-height: 1.3em;
}
.family-info-foot span:first-child {
  width: 85px;
}
.family-info-foot span {
  display: inline-block;
  width: 70px;
}
.family-info-foot em {
  display: block;
  color: #fff;
}
.family-avator:hover .family-mask{
  opacity: 0;
  filter:alpha(opacity=0);
}
.family-big-mask {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  filter: alpha(opacity=60);
  background-color: #edf1f4;
  z-index: 10;
}
.family-text {
  position: absolute;
  width: 238px;
  height: 46px;
  top: 50%;
  left: 50%;
  background: url(http://static.mukewang.com/static/img/family-text.png) no-repeat;
  margin: -23px 0 0 -119px;
  z-index: 11;
  opacity: 1;
  display: block;
}
.hide-text {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.mobile {
  background: url(http://static.mukewang.com/static/img/mobile-bg.png);
}
.mobile-wrap {
  position: relative;
  overflow: hidden;
  height: 580px;
}
.mobile-title {
  width: 347px;
  height: 31px;
  margin: 80px auto 0 auto;
  background: url(http://static.mukewang.com/static/img/phone-text.png) no-repeat 0 0;
}
.mobile-entry {
  text-align: center;
  padding: 40px;
}
.mobile-entry a {
  display: inline-block;
  width: 158px;
  height: 38px;
  line-height: 38px;
  border-radius: 50px;
  vertical-align: middle;
  color: #be3948;
  transition: .3s;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
  border: 1px solid #be3948;
  margin: 0 10px;
}
.mobile-entry a:hover{
  color: #fff;
  background-color: #be3948;
}
.mobile-trigger {
  display: inline-block;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  cursor: pointer;
  background: url(http://static.mukewang.com/static/img/index2-sprite.png) no-repeat 1px -27px;
}
.mobile-trigger:hover{
  background-position: 0 0;
}
.mk-mobile-bg {
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -402px;
  width: 804px;
  height: 307px;
  background: url(http://static.mukewang.com/static/img/index/mk-mobile-bg.png) no-repeat center top;
}
.mk-down-qrcode {
  position: absolute;
  left: 50%;
  bottom: 86px;
  margin-bottom: -30px;
  margin-left: -208px;
  width: 417px;
  height: 192px;
  opacity: 0;
  background: url(http://static.mukewang.com/static/img/index/mk-down-qrcode.png) no-repeat center 0;
}
.joinmooc {
  height: 360px;
  overflow: hidden;
  background-color: #eef1f2;
}
.joinmooc-active .joinbtn {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
  filter: alpha(opacity = 100);
}
.joinbtn{
  padding-top: 40px;
  text-align: center;
}
.joinbtn a {
  display: inline-block;
  height: 60px;
  line-height: 60px;
  width: 220px;
  border-radius: 50px;
  background: #be3948 url(http://static.mukewang.com/static/img/begin-text.png) no-repeat center center;
  color: #fff;
  font-size: 24px;
  transition: .3s;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
}
.joinbtn a:hover{
  background-color: #cb616d;
}
h2{
    font-size: 20px;
    display: block;
}


.container {
  width: 1200px;
  margin: 0 auto;
}
.footer-sns {
  padding-top: 30px;
  text-align: center;
}
.footer-sns a{
  display: inline-block;
  height: 32px;
  width: 32px;
  vertical-align: middle;
  background-image: url(http://static.mukewang.com/static/img/idx-btm.png);
  background-repeat: no-repeat;
  margin: 0 9px;
}
.footer-sns-weibo {
  background-position: 0 -221px;
}
.footer-sns-weixin {
  position: relative;
  background-position: -52px -221px;
}
.footer-sns-weixin i {
  position: absolute;
  display: none;
  width: 176px;
  height: 210px;
  background: url(http://static.mukewang.com/static/img/idx-btm.png) no-repeat 0 0;
  left: -72px;
  bottom: 40px;
}
.footer-sns-qqweibo {
  background-position: -104px -221px;
}
.footer-sns-qzone {
  background-position: -156px -221px;
}
.footer-sns-weibo:hover{
  background-position: 0 -262px;
}
.footer-sns-weixin:hover{
  background-position: -52px -262px;
}
.footer-sns-weixin:hover i{
  display: block;
}
.footer-sns-qqweibo:hover{
  background-position: -104px -262px;
}
.footer-sns-qzone:hover{
  background-position: -156px -262px;
}
.footer-link {
  padding: 25px 0;
  margin: 0 auto;
  text-align: center;
  border-bottom: 1px solid #d0d6d9;
}
.footer-link a {
  margin: 0 10px;
  color: #99a1a6;
}
.footer-link a:hover{
    color: #be3948;
}
.friendly-link {
  height: 50px;
  line-height: 50px;
  border-bottom: 1px solid #edf1f2;
  color: #c8cdd2;
  text-align: center;
}
.footer-copyright {
  padding: 20px 0 25px;
  text-align: center;
  color: #b4bbbf;
}
.friendly-link span {
  font-weight: bold;
  margin-right: 10px;
}
.friendly-link a {
  color: #c8cdd2;
  margin: 0 10px;
}
.friendly-link a:hover{
    color: black;
}
.kexin:hover{
    transform:scale(1.5,1.5);
}
</style>
</head>
<body>
<div id="header" class="header">
	<div class="logo"><a href="http://www.imooc.com/"></a></div>
	<div class="header-list">
		<ul>
			<li><a href="http://www.imooc.com/course/list">课程</a></li>
			<li><a href="http://www.imooc.com/course/program">计划</a></li>
			<li><a href="http://www.imooc.com/corp/index">分享</a></li>
			<li><a href="http://www.imooc.com/wenda">社区</a></li>
		</ul>
	</div>
	<div class="header-enter">
		<ul>
			<li class="denglu"><a  href="#" >登录</a></li>
			<li class="zhuce"><a  href="#" >注册</a></li>
		</ul>
	</div>
	<div class="headerapp"><a href="http://www.imooc.com/mobile/app"><i class="header-app-icon"></i>慕课APP</a></div>
<div class="header-search">
<input class="search" placeholder="请输入想搜索的内容..." type="text">
</div>
</div>

<div class="part-a">
	<div class="content" id="content">
		<div id="first" class="first listimg img0">
			<div class="first-1"><a href="#">了解更多</a>
			</div>
		</div>
		<div id="second" class="second listimg img1">
			<div class="second-1">
				
			</div>
		</div>
		<div id="third" class="third listimg img2">
			<div class="third-1">
				
			</div>
		</div>
		<div id="fourth" class="fourth listimg img3">
			<div class="fourth-1">
			
			</div>
		</div>
    </div>
    <div class="content-bar">
            <span class="listimg img0" data-index="0"></span>
            <span class="listimg img1" data-index="1"></span>
            <span class="listimg img2" data-index="2"></span>
            <span class="listimg img3" data-index="3"></span>
    </div>   
    <a href="javascript:void(0);" class="parta-bar bar-prev">上一页</a>
    <a href="javascript:void(0);" class="parta-bar bar-next">下一页</a>
        

</div>

<div class="part-b samewidth">
    <div class="five minwidth">
        <div class="box1">
            <span class="pic1"></span>
            <span class="pic2"></span>
            <span class="pic3"></span>
        </div>
    </div>
</div>

<div id="part-c" class="part-c samewidth">
    <div class="six minwidth">
        <div id="part-c pic4-1" class="part-c pic4-1 stars"></div>
        <div class="part-c pic4-1 videowrap"></div>
        <div id="part-c pic5-1" class="part-c pic5-1"></div>
    </div>
</div>
<div class="part-d samewidth">
    <div class="six minwidth">
        <div id="part-d pic5"  class="part-d pic5"></div>
        <div id="part-d pic4"  class="part-d pic4 computer1"></div>
        <div class="part-d pic4 computer2"></div>
    </div>
</div>
<div id="part-e" class="part-e samewidth">
    <div class="six minwidth">
        <div id="part-e pic4-1"  class="part-e pic4-1 rocket"></div>
        <div class="part-e pic4-1 calander"></div>
        <div class="part-e pic4-1 smoke"></div>
        <div id="part-e pic5-1"  class="part-e pic5-1"></div>
    </div>
</div>
<div class="part-f samewidth">
    <div class="six minwidth">
        <div id="part-f pic5" class="part-f pic5"></div>
        <div id="part-f pic4" class="part-f pic4 hands"></div>
        <div class="part-f pic4 icon"></div>
    </div>
</div>


<div id="part-g" class="part-g samewidth">
    <div class="seven minwidth">
    <div class="part-g-left"></div>
    <div class="part-g-right"></div>
        <ul class="group">
            <li>
                <a href="http://www.imooc.com/activity/javaerindex" target="_blank"><img src="http://img.mukewang.com/55682623000179d404000200.jpg" alt="java学习专题"></a>
            </li>
            <li>
                <a href="http://www.imooc.com/mobile/app" target="_blank"><img src="http://img.mukewang.com/56652b550001e33a04000200.jpg" alt="阿里云合作"></a>
            </li>
            <li>
                <a href="http://www.ituring.com.cn/book/1605"><img src="http://img.mukewang.com/556e52720001505804000200.jpg" alt="图灵合作图书推广"></a>
            </li>
        </ul>
    </div>
</div>

<div id="part-h" class="part-h ">
    <div class="eight minwidth">
        <h2 class="big">课程</h2>
    <ul class="icourse-course clearfix">
        <li>
            <a href="http://www.imooc.com/view/85">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/536059be00010b6d06000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>本课程会从Java环境搭建、基础语法开始，带你进入神秘的进入Java世界</p>
                    <span class="l icourse-new">
                              更新至8-1
                    </span>
                    <span class="r">
                              课程时长： 5小时 0分
                    </span>
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>Java入门第一季</h2>                    
                    <span class="l icourse-new">7小时前更新</span>
                    <span class="r">198498人学习</span> 
                </div>
            </a>
        </li>
        <li>
            <a href="http://www.imooc.com/view/551">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/565bad800001d67b06000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>本课程为Cocos2d-x入门教程第二门</p>
                    <span class="l icourse-new">
                              更新至5-1
                    </span>
                    <span class="r">
                              课程时长： 2小时33分
                    </span>
                    
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>Cocos2d-x基础教程二-会动的时钟</h2>
                    <span class="l icourse-new">12小时前更新</span>
                    <span class="r">2186人学习</span>
                </div>
            </a>
        </li>
        <li>
            <a href="http://www.imooc.com/view/496">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/55effd1c0001d01f06000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>jquery.transform制作带旋转效果的焦点图轮播器</p>
                    <span class="l icourse-new">
                              更新至3-7
                    </span>
                    <span class="r">
                              课程时长： 1小时52分
                    </span>
                    
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>Jquery插件transform旋转焦点图</h2>
                    <span class="l icourse-new">12小时前更新</span>
                    <span class="r">801人学习</span>
                </div>
            </a>
        </li>
        <li>
            <a href="http://www.imooc.com/view/552">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/565eb1c9000172ef06000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>Cloud Backup的基本功能和主要架构</p>
                    <span class="l ">
                              更新至1-2
                    </span>
                    <span class="r">
                              课程时长：39分
                    </span>
                    
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>MongoDB 在线讲座系列之MongoDB数据库备份策略/Ops Manager</h2>
                    <span class="l ">4天前更新</span>
                    <span class="r">2182人学习</span>
                </div>
            </a>
        </li>
        <li>
            <a href="http://www.imooc.com/view/177">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/540e57300001d6d906000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>未来您要会的优雅、明确、简单语言</p>
                    <span class="l ">
                              更新至10-4
                    </span>
                    <span class="r">
                              课程时长： 5小时 0分
                    </span>
                    
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>Python入门</h2>
                    <span class="l ">5天前更新</span>
                    <span class="r">89117人学习</span>
                </div>
            </a>
        </li>
        <li>
            <a href="http://www.imooc.com/view/457">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/55adbd5700019ed806000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>Python 错误和异常处理!</p>
                    <span class="l ">
                              更新至3-2
                    </span>
                    <span class="r">
                              课程时长： 1小时18分
                    </span>
                    
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>Python错误和异常</h2>
                    <span class="l ">5天前更新</span>
                    <span class="r">5898人学习</span>
                </div>
            </a>
        </li>
        <li>
            <a href="http://www.imooc.com/view/492">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/55e55e7f0001b38806000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>掌握Golang IO操作, 游走二进制领域</p>
                    <span class="l ">
                              更新至5-1
                    </span>
                    <span class="r">
                              课程时长： 2小时 0分
                    </span>
                    
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>Golang之IO操作初接触</h2>
                    <span class="l ">6天前更新</span>
                    <span class="r">2487人学习</span>
                </div>
            </a>
        </li>
        <li>
            <a href="http://www.imooc.com/view/549">
                <div class="icourse-img">
                <img src="http://img.mukewang.com/565568bb0001301e06000338-280-160.jpg" alt="">
                </div>
                <div class="icourse-part1 clearfix">
                    <p>聊一聊手机UI尺寸的知识</p>
                    <span class="l ">
                              更新至4-1
                    </span>
                    <span class="r">
                              课程时长：40分
                    </span>
                    
                </div>
                <div class="icourse-part2 clearfix">
                    <h2>手机UI设计基础-尺寸</h2>
                    <span class="l ">2015-11-30更新</span>
                    <span class="r">8116人学习</span>
                </div>
            </a>
        </li>
    </ul>
    <div class="icourse-footer">
        <a href="http://www.imooc.com/course/list">全部课程</a>
    </div>
    </div>
</div>

<div id="js-family" class="family samewidth">
  <div class="minwidth">
    <ul class="clearfix">
        <li class="js-family-item family-item family-teacher l">
            <a href="/space/teacher/id/1033307" class="family-avator">
              <div class="family-mask"></div>
              <img src="http://img.mukewang.com/5469ba4e0001b81502200220-200-200.jpg" width="200" height="200">
            </a>
            <div class="js-family-info family-info family-info-t " style="display: none;">
              <h3 class="family-teacher-nick">Rango</h3>
              <p class="family-info-job">PHP开发工程师</p>
              <p class="family-info-desc">多玩技术部基础平台组技术经理，PHP官方PECL开发组成员，Swoole开源项目创始人，前腾讯朋友网、易迅网、淘宝网搜索的后台团队核心技术骨干。</p>
            </div>
          </li>
        
        <li class="family-item family-student l">
            <ul class="clearfix">
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/110691" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/54c8580c0001e49f14400900-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s " style="display: none;">
                    <h3 class="family-student-nick">leejersey</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>1833小时55分</em>
                      </span>
                      <span>
                        报名
                        <em>214门课程</em>
                      </span>
                    </div>
                  </div>
                </li>

                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/130804" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/55d1deb00001af9e05330300-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">学习人生</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>1595小时48分</em>
                      </span>
                      <span>
                        报名
                        <em>150门课程</em>
                      </span>
                    </div>
                  </div>
                </li>

                 <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/220512" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/53b7be310001796301800180-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s " style="display: none;">
                    <h3 class="family-student-nick">Raymond小文</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>1333小时39分</em>
                      </span>
                      <span>
                        报名
                        <em>108门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/165429" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/533e4c700001c60f02200220-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">名小鹅</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>1062小时55分</em>
                      </span>
                      <span>
                        报名
                        <em>111门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
            </ul>
          </li>
        
        <li class="js-family-item family-item family-teacher l">
            <a href="/space/teacher/id/139096" class="family-avator">
              <div class="family-mask"></div>
              <img src="http://img.mukewang.com/5382a89c000102cd00800064-200-200.jpg" width="200" height="200">
            </a>
            <div class="js-family-info family-info family-info-t ">
              <h3 class="family-teacher-nick">Pangee</h3>
              <p class="family-info-job"></p>
              <p class="family-info-desc">高级研发工程师，就职于全球颇有影响力的搜索引擎公司，曾供职于新浪。负责移动客户端相关的服务端研发工作，对大流量业务、高并发业务有较多的经验与解决方案。技术极客，喜欢一切新特奇技术，希望把技术做到极致。...</p>
            </div>
          </li>
        
        <li class="family-item family-student l">
            <ul class="clearfix">
                 <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/134758" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/53d9bc1b0001c90002000200-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">RainbowPeter</h3>
                    <p class="family-info-job">JAVA开发工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>1024小时36分</em>
                      </span>
                      <span>
                        报名
                        <em>278门课程</em>
                      </span>
                    </div>
                  </div>
                </li>

                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/1128997" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/55c0bcce0001e21107400738-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">smile_again</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>669小时44分</em>
                      </span>
                      <span>
                        报名
                        <em>89门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/1117550" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/55ab8dff0001246c02790279-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">Linda_liu</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>613小时16分</em>
                      </span>
                      <span>
                        报名
                        <em>107门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/285324" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/54af858d000194ea01800180-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">加加摩尔</h3>
                    <p class="family-info-job">PHP开发工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>593小时 6分</em>
                      </span>
                      <span>
                        报名
                        <em>92门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
            </ul>
          </li>
        
          <li class="js-family-item family-item family-teacher l">
            <a href="/space/teacher/id/108955" class="family-avator">
              <div class="family-mask"></div>
              <img src="http://img.mukewang.com/5347593e00010cfb01400140-200-200.jpg" width="200" height="200">
            </a>
            <div class="js-family-info family-info family-info-t family-info-right">
              <h3 class="family-teacher-nick">liuyubobobo</h3>
              <p class="family-info-job">其它</p>
              <p class="family-info-desc">创业者，全栈工程师，持续学习者。对技术开发，产品设计、前后端，ios，html5，智能算法等领域均有接触；拥有多款独立App作品；对一切可编程的东西有浓厚兴趣，对游戏编程格外感兴趣。相信编程改变一切。</p>
            </div>
          </li>
        
          <li class="family-item family-student l">
            <ul class="clearfix">
              <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/205587" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/54c98d9b0001203205880576-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s family-info-right">
                    <h3 class="family-student-nick">酸奶沙冰</h3>
                    <p class="family-info-job">交互设计师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>574小时26分</em>
                      </span>
                      <span>
                        报名
                        <em>181门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/125844" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/5379bf290001590c01800180-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s family-info-right">
                    <h3 class="family-student-nick">O_Duok</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>543小时58分</em>
                      </span>
                      <span>
                        报名
                        <em>13门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/168449" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/545850e10001f06002200220-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s family-info-right">
                    <h3 class="family-student-nick">w7851435</h3>
                    <p class="family-info-job">PHP开发工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>496小时24分</em>
                      </span>
                      <span>
                        报名
                        <em>101门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/437419" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/5458502c00012d4a02200220-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s family-info-right">
                    <h3 class="family-student-nick">化龙贝</h3>
                    <p class="family-info-job">学生</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>458小时14分</em>
                      </span>
                      <span>
                        报名
                        <em>229门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
             </ul>
          </li>
        
          <li class="family-item family-student l">
            <ul class="clearfix">
               <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/103118" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/53dc49530001ab8005110800-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">MistyMoon</h3>
                    <p class="family-info-job">其它</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>440小时26分</em>
                      </span>
                      <span>
                        报名
                        <em>147门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/111574" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/535d9b1f0001169404800640-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">Cynthia</h3>
                    <p class="family-info-job">UI设计师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>421小时55分</em>
                      </span>
                      <span>
                        报名
                        <em>67门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/217463" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/53b528fd0001fdee01000100-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">沧海一声笑_0001</h3>
                    <p class="family-info-job"></p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>417小时 2分</em>
                      </span>
                      <span>
                        报名
                        <em>39门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/175534" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/5391fa45000138ad01800180-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">JoeMartini</h3>
                    <p class="family-info-job">产品经理</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>396小时53分</em>
                      </span>
                      <span>
                        报名
                        <em>15门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
            </ul>
          </li>
        
          <li class="js-family-item family-item family-teacher l">
            <a href="/space/teacher/id/101686" class="family-avator">
              <div class="family-mask"></div>
              <img src="http://img.mukewang.com/536b4d120001005f02720306-200-200.jpg" width="200" height="200">
            </a>
            <div class="js-family-info family-info family-info-t " style="display: none;">
              <h3 class="family-teacher-nick">远人</h3>
              <p class="family-info-job">其它</p>
              <p class="family-info-desc">资深前端攻城师，先后就职于腾讯、人人网，具有丰富的海量服务前端开发经验。也曾担任多个创业团队技术顾问。现就职于某知名互联网公司，是最资深的云前端工程师，首席前端架构师，实践经验丰富。</p>
            </div>
          </li>
        
          <li class="family-item family-student l">
            <ul class="clearfix">
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/158150" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/54b67d0a0001074001000100-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">K_Biao</h3>
                    <p class="family-info-job">学生</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>391小时 2分</em>
                      </span>
                      <span>
                        报名
                        <em>142门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/239230" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/5454fb0b00016d1401800180-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">MicLee</h3>
                    <p class="family-info-job">JAVA开发工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>371小时37分</em>
                      </span>
                      <span>
                        报名
                        <em>15门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/104514" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/55e00e6a0001f4ee23642364-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">Jaywin丶</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>352小时53分</em>
                      </span>
                      <span>
                        报名
                        <em>129门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/337815" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/545865c30001a2d802200220-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">伪文艺文委</h3>
                    <p class="family-info-job">其它</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>313小时44分</em>
                      </span>
                      <span>
                        报名
                        <em>108门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
             </ul>
          </li>
        
          <li class="js-family-item family-item family-teacher l">
            <a href="/space/teacher/id/197450" class="family-avator">
              <div class="family-mask"></div>
              <img src="http://img.mukewang.com/549beab90001be9037445616-200-200.jpg" width="200" height="200">
            </a>
            <div class="js-family-info family-info family-info-t ">
              <h3 class="family-teacher-nick">张鑫旭</h3>
              <p class="family-info-job">页面重构设计</p>
              <p class="family-info-desc">web前端，就职于腾讯ISUX上海设计中心，喜欢卖萌打杂，同事都叫我张老师，(*^__^*) 嘻嘻……
</p>
            </div>
          </li>
        
        <li class="family-item family-student l">
            <ul class="clearfix">
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/235374" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/53c7d2a00001e09801000100-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">宝贝我一直在</h3>
                    <p class="family-info-job">Linux系统工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>294小时26分</em>
                      </span>
                      <span>
                        报名
                        <em>65门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/1378011" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/5647305a000185ee09940619-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">luona</h3>
                    <p class="family-info-job">学生</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>248小时15分</em>
                      </span>
                      <span>
                        报名
                        <em>24门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/215920" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/55a3180d0001a3d906400658-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">路飞弟弟</h3>
                    <p class="family-info-job">Web前端工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>229小时10分</em>
                      </span>
                      <span>
                        报名
                        <em>84门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
                
                <li class="js-family-item family-sub-item">
                  <a href="/space/u/uid/113818" class="family-avator">
                    <div class="family-mask"></div>
                    <img src="http://img.mukewang.com/user/5365e348000133ca01000100-160-160.jpg" width="100" height="100" title="100" alt="100">
                  </a>
                  <div class="js-family-info family-info family-info-s ">
                    <h3 class="family-student-nick">鱼与熊掌势必要兼得</h3>
                    <p class="family-info-job">软件测试工程师</p>
                    <div class="family-info-foot">
                      <span>
                        学习
                        <em>170小时15分</em>
                      </span>
                      <span>
                        报名
                        <em>35门课程</em>
                      </span>
                    </div>
                  </div>
                </li>
              </ul>
          </li>
        
          <li class="js-family-item family-item family-teacher l">
            <a href="/space/teacher/id/225594" class="family-avator">
              <div class="family-mask"></div>
              <img src="http://img.mukewang.com/53bce3ba00014c3932644928-200-200.jpg" width="200" height="200">
            </a>
            <div class="js-family-info family-info family-info-t family-info-right">
              <h3 class="family-teacher-nick">林永坚Jake</h3>
              <p class="family-info-job">其它</p>
              <p class="family-info-desc">全栈工程师，独立开发者，咨询公司高级顾问。所开发的iOS APP多次登上苹果App Store分类榜榜首。做为一个持续学习者，不间断地折腾各种新技术和方法，并乐于推广，让大家一起感受技术的力量！</p>
            </div>
          </li>
        
          </ul>
  </div>
  <div id="js-family-mask" class="family-big-mask" style="opacity: 0.6; display: block;"></div>
  <div id="js-family-text" class="family-text hide-text" style="opacity: 1; display: block;">慕课大家庭</div>
</div>



<div class="mobile samewidth">
  <div class="mobile-wrap minwidth">
    <h2 class="mobile-title hide-text">手机慕课，随时随地学习！</h2>
    <div class="mobile-entry">
      <a href="http://www.imooc.com/mobile/app" target="_blank"><!-- Android版 -->手机版</a>
      <a href="http://www.imooc.com/mobile/app?curr=ipad" target="_blank"><!-- IOS版 -->iPad版</a>
      <span id="js-mobile-trigger" class="mobile-trigger"></span>
    </div>
    <div class="mk-mobile-bg" id="J-mk-mobile-bg"></div>
    <div class="mk-down-qrcode" id="J-mk-down-qrcode"></div>
  </div>
</div>

<div class="joinmooc bg-grey samewidth joinmooc-active">
  <div class="joinmooc-wrap minwidth">
    <h2 class="hide-text">慕课网，只学有用的！</h2>
    <div class="joinbtn">
      <a href="/course/list" class="hide-text">
        立即加入
      </a>
    </div>
  </div>
</div>

<div class="footer samewidth">
  <div class="container">
    <div class="footer-wrap minwidth">
      <div class="footer-sns">
        <a href="http://weibo.com/u/3306361973" class="footer-sns-weibo hide-text" target="_blank" title="新浪微博">新浪微博</a>
        <a href="javascript:void(0);" class="footer-sns-weixin" target="_blank" title="微信">
          <i class="footer-sns-weixin-expand"></i>
        </a>
        <a href="http://t.qq.com/mukewang999" class="footer-sns-qqweibo hide-text" target="_blank" title="腾讯微博">腾讯微博</a>
        <a href="http://user.qzone.qq.com/1059809142/" class="footer-sns-qzone hide-text" target="_blank" title="QQ空间">QQ空间</a>
      </div>
    </div>
    <div class="footer-link">
      <a href="/about/us" title="关于我们">关于我们</a>
      <a href="/about/job" title="人才招聘">人才招聘</a>
      <a href="/about/recruit" title="讲师招募">讲师招募</a>
      <a href="/about/contact" title="联系我们">联系我们</a>
      <a href="/user/feedback" title="意见反馈">意见反馈</a>
    </div>
        <div class="friendly-link">
      <span>友情链接：</span>
            <a href="http://hao.360.cn" target="_blank" title="360导航">360导航</a>
            <a href="http://www.php-z.com/" target="_blank" title="PHP站中文网">PHP站中文网</a>
            <a href="http://www.hao123.com" target="_blank" title="hao123">hao123</a>
            <a href="http://www.lagou.com" target="_blank" title="拉勾网">拉勾网</a>
            <a href="http://www.admin10000.com/" target="_blank" title="web开发者">web开发者</a>
            <a href="/about/friendly" title="友情链接">更多...</a>
    </div>
        <div class="footer-copyright">
      Copyright © 2015 imooc.com All Rights Reserved | 京ICP备 13046642号-2
    </div>
    <div style="text-align:center;margin-top:-10px;padding-bottom:10px;">
      <!--可信网站图片LOGO安装开始-->
      <script src="http://kxlogo.knet.cn/seallogo.dll?sn=e15030311010657818aeau000000&amp;size=3"></script><a href="https://ss.knet.cn/verifyseal.dll?sn=e15030311010657818aeau000000&amp;ct=df&amp;a=1&amp;pa=0.7065890831872821" target="_blank" kx_type="缩放式" style="display:inline-block;position:relative;width:89px;height:32px;"><img src="http://rr.knet.cn/static/images/logo/cnnic.png" class="kexin" height="32" width="89" h="32" w="89"  style="left:0;position:absolute;top:0;border:none;"></a>
      <!--可信网站图片LOGO安装结束-->
    </div>
  </div>
</div>

    <!--<script type="text/javascript" src="mkwsy.js"></script>-->
    <script type="text/javascript" src="jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="mkwsyjq.js"></script>
    <script type="text/javascript" src="mkwsyscroll.js"></script>
</body>
</html>